$(function () {
    var layer = layui.layer
    // 定义美化时间的
    template.defaults.imports
    //1 定义一个查询的参数对象，将来请求数据的时候，需要将请求参数对象提交到服务器
    var q = {
        pagenum: 1, //默认请求第一页数据
        pagesize: 2, //默认显示两条
        cate_id: '', //文章分类的id
        status: '' //文件的发布状态
    }
    // 为模板引擎添加过
    template.defaults.imports.dateFormat = function (val) {
        return moment(val).format('YYYY-MM-DD hh:mm:ss');
    }
    initTable()
    getCATTable()
    // 2获取文章列表数据的方法
    function initTable() {
        $.ajax({
            method: 'GET',
            url: '/my/article/list',
            data: q,
            success(res) {
                // 如果报错就停止
                if (res.status !== 0) return layui.layer.msg(res.mesage)
                // 如果成功就通过模板引擎生成数据行标签
                var strHtml = template('tpl-table', res)
                // 将生成的行标签渲染到tbody
                $('tbody').html(strHtml)
                // 生成页码条
                renderPageBEER(res.total)
            }
        })
    }
    // 生成页码条
    function renderPageBEER(total) {
        // a.生成页码条，渲染到页面中
        layui.laypage.render({
            elem: 'pageBox', //注意，这里的 test1 是 ID，不用加 # 号
            count: total, // 总函数
            limit: q.pagesize, // 页容量
            limits: [2, 5, 10, 15], //页容量 下拉框
            curr: q.pagenum, // 页码
            // 布局
            layout: ['count', 'limit', 'prev', 'page', 'next', 'skip'],
            jump(a, first) { //跳转方法
                console.log(a)
                // 设置好被点击的页码
                q.pagenum = a.curr
                // 设置选中新的页容量
                q.pagesize = a.limit
                    // 请求 新页的数据
                    !first && initTable()
            }
        });
    }
    //3 查询文章分类列表方法
    function getCATTable() {
        $.ajax({
            method: 'GET',
            url: '/my/article/cates',
            data: q,
            success(res) {
                // 如果报错就停止
                if (res.status !== 0) return layui.layer.msg(res.mesage)
                // 如果成功就通过模板引擎生成数据行标签
                var strHtml = template('tpl-cate', res)
                // 将生成的行标签渲染到tbody
                $('[name= cate_id]').html(strHtml)
                // 手动调用layui.form.rander方法
                layui.form.render()
            }
        })
    }
    // 4 筛选表单提交事件
    $('#form-search').on('submit', function (e) {
        e.preventDefault()
        // 将下拉选中值设置给q
        q.cate_id = $('[name=cate_id]').val()
        q.state = $('[name=state]').val()
        // 重新查询
        initTable()
    })
    // 为删除按钮绑定事件
    $('tbody').on('click', '.btn-delete', function () {
        // 获取按钮上的id
        const id = this.dataset.id
        // 询问是否删除
        layer.confirm('本当に削除しますか？この操作は不可逆的です', function (index) {
            // 发送删除操作
            $.ajax({
                method: 'GET',
                url: '/my/article/delete/' + id,
                success(res) {
                    // 如果出错，则提示，并停止执行
                    if (res.status !== 0) return layui.layer.msg(res.message)
                    console.log(res);
                    // 如果成功，重新加载当前数据
                    // 判断在当页上 是否还有唯一的一行数(通过 删除按钮个数来统计)
                    // 如果只有一个，则说明 已经刚刚删除完了
                    if ($('.btn-delete').length === 1) {
                        // 如果当前页页码是1，则仍然是1
                        // 如果当前的页码>1,则-1
                        if (q.pagenum > 1) q.pagenum--
                    }
                    initTable()
                }
            })
            // 关闭弹窗
            layui.layer.close(index);
        })
    })
})